document.addEventListener('DOMContentLoaded', function() {
    // 音乐列表数据 - 根据你的实际文件修改
    const songs = [
        {
            title: "发如雪",
            artist: "周杰伦",
            src: "music/song1.mp3",
            cover: "images/cover1.jpg"
        },
        {
            title: "浪漫手机",
            artist: "周杰伦",
            src: "music/song2.mp3",
            cover: "images/cover2.jpg"
        },
        // 可以添加更多歌曲
    ];
    
    // 获取DOM元素
    const audioPlayer = document.getElementById('audio-player');
    const playBtn = document.getElementById('play-btn');
    const prevBtn = document.getElementById('prev-btn');
    const nextBtn = document.getElementById('next-btn');
    const progressBar = document.getElementById('progress-bar');
    const currentTimeEl = document.getElementById('current-time');
    const durationEl = document.getElementById('duration');
    const songTitleEl = document.getElementById('song-title');
    const songArtistEl = document.getElementById('song-artist');
    const coverImg = document.getElementById('cover-img');
    const songListEl = document.getElementById('song-list');
    
    let currentSongIndex = 0;
    let isPlaying = false;
    
    // 初始化播放器
    function initPlayer() {
        // 生成播放列表
        songs.forEach((song, index) => {
            const li = document.createElement('li');
            li.textContent = `${song.title} - ${song.artist}`;
            li.addEventListener('click', () => playSong(index));
            songListEl.appendChild(li);
        });
        
        // 加载第一首歌
        loadSong(currentSongIndex);
    }
    
    // 加载歌曲
    function loadSong(index) {
        const song = songs[index];
        songTitleEl.textContent = song.title;
        songArtistEl.textContent = song.artist;
        coverImg.src = song.cover;
        audioPlayer.src = song.src;
        
        // 更新播放列表中的当前播放歌曲样式
        updatePlaylistStyle(index);
    }
    
    // 更新播放列表样式
    function updatePlaylistStyle(index) {
        const items = songListEl.querySelectorAll('li');
        items.forEach((item, i) => {
            if (i === index) {
                item.classList.add('playing');
            } else {
                item.classList.remove('playing');
            }
        });
    }
    
    // 播放歌曲
    function playSong(index) {
        if (index !== currentSongIndex) {
            currentSongIndex = index;
            loadSong(currentSongIndex);
        }
        
        audioPlayer.play();
        isPlaying = true;
        playBtn.textContent = '暂停';
    }
    
    // 暂停歌曲
    function pauseSong() {
        audioPlayer.pause();
        isPlaying = false;
        playBtn.textContent = '播放';
    }
    
    // 上一曲
    function prevSong() {
        currentSongIndex--;
        if (currentSongIndex < 0) {
            currentSongIndex = songs.length - 1;
        }
        playSong(currentSongIndex);
    }
    
    // 下一曲
    function nextSong() {
        currentSongIndex++;
        if (currentSongIndex >= songs.length) {
            currentSongIndex = 0;
        }
        playSong(currentSongIndex);
    }
    
    // 更新进度条
    function updateProgress() {
        const { duration, currentTime } = audioPlayer;
        const progressPercent = (currentTime / duration) * 100;
        progressBar.value = progressPercent;
        
        // 更新时间显示
        const durationMinutes = Math.floor(duration / 60);
        let durationSeconds = Math.floor(duration % 60);
        if (durationSeconds < 10) {
            durationSeconds = `0${durationSeconds}`;
        }
        
        const currentMinutes = Math.floor(currentTime / 60);
        let currentSeconds = Math.floor(currentTime % 60);
        if (currentSeconds < 10) {
            currentSeconds = `0${currentSeconds}`;
        }
        
        if (duration) {
            durationEl.textContent = `${durationMinutes}:${durationSeconds}`;
            currentTimeEl.textContent = `${currentMinutes}:${currentSeconds}`;
        }
    }
    
    // 设置进度条
    function setProgress(e) {
        const width = this.clientWidth;
        const clickX = e.offsetX;
        const duration = audioPlayer.duration;
        audioPlayer.currentTime = (clickX / width) * duration;
    }
    
    // 事件监听
    playBtn.addEventListener('click', () => {
        isPlaying ? pauseSong() : playSong(currentSongIndex);
    });
    
    prevBtn.addEventListener('click', prevSong);
    nextBtn.addEventListener('click', nextSong);
    
    audioPlayer.addEventListener('timeupdate', updateProgress);
    audioPlayer.addEventListener('ended', nextSong);
    
    progressBar.addEventListener('input', function() {
        const seekTime = (audioPlayer.duration / 100) * this.value;
        audioPlayer.currentTime = seekTime;
    });
    
    // 初始化播放器
    initPlayer();
});